//
//  HTEpSelectView.swift
//  MagaCore
//
//  Created by MrMessy on 2023/5/30.
//

import SwiftUI

struct HTEpPortraitSelectView: View {

  @Binding var var_selEp_id: String?
  @State private var var_animeInfo: HTAnime!
  @State private var var_onHideDialog: (() -> Void)?
  @State private var var_onSelEp: ((HTEp) -> Void)?
  @State private var var_currentSsns: [HTEp] = []
  @State private var var_selEp: HTEp!
  @State private var var_currentSsnTitle: String = ""

  init(var_selEp_id: Binding<String?>, var_animeInfo: HTAnime, var_onHideDialog: (() -> Void)? = nil, var_onSelEp: ((HTEp) -> Void)? = nil) {
    _var_selEp_id = var_selEp_id
    _var_animeInfo = State(initialValue: var_animeInfo)
    _var_onHideDialog = State(initialValue: var_onHideDialog)
    _var_onSelEp = State(initialValue: var_onSelEp)
    _var_selEp = State(initialValue: var_animeInfo.ht_curEp(ep_id: var_selEp_id.wrappedValue ?? ""))
    _var_currentSsns = State(initialValue: var_animeInfo.ht_currentSsns(ep_id: var_selEp_id.wrappedValue ?? ""))
    _var_currentSsnTitle = State(initialValue: var_animeInfo.ht_currentSsnTitle(ep_id: var_selEp_id.wrappedValue ?? ""))
  }

  var body: some View {
    VStack(alignment: .leading, spacing: 0){
      VStack(alignment: .leading, spacing: 0){
        HStack(alignment: .top, spacing: 0) {
          Text("Episode")
            .ht_commonTextStyle(color: Color(hex: var_darkColor), fontSize: var_h3, weight: .bold)
            .lineLimit(1)
            .padding(.leading, var_marginLeft)
          Spacer()
          Button() {
            var_onHideDialog!()
          }label: {
            Image("episode_close")
              .ht_resizeToFit()
              .frame(width: 18, height: 18)
              .padding(.trailing, var_marginLeft)
          }
        }
        .frame(width: UIDevice.ht_screenWidth(), height: 44)
        ScrollView(.horizontal, showsIndicators: false) {
          ScrollViewReader { var_scroll in
            HStack(spacing: 0) {
              ForEach(0..<(var_animeInfo?.var_ssn_list ?? []).count, id:\.self) { index in
                let var_ssn = (var_animeInfo.var_ssn_list ?? [])[index]
                let var_selected = var_ssn == var_currentSsnTitle
                Button() {
                  var_currentSsnTitle = var_ssn
                  var_currentSsns = var_animeInfo?.var_eps_dict?[var_ssn] ?? []
                } label: {
                  Text(var_ssn)
                    .ht_commonTextStyle(color: Color(hex: var_selected ? var_orangeColor : var_darkColor), fontSize: var_h4, weight: .none)
                    .padding(.leading, 16)
                    .padding(.trailing, 16)
                    .padding(.top, 5)
                    .padding(.bottom, 5)
                    .background(var_selected ? var_orangeBg : Color(white: 0, opacity: 0.04))
                    .cornerRadius(4)
                    .padding(.trailing, 16)
                    .id(index)
                }.onAppear{
                  if var_selected == true {
                    var_scroll.scrollTo(index)
                  }
                }
              }
            }
          }
        }
        .padding(.leading, var_marginLeft)
        .padding(.vertical, 10)
        Divider()
        VStack(alignment: .leading, spacing: 0) {
          ScrollView(showsIndicators: false) {
            ScrollViewReader { var_scroll in
              ForEach(0..<var_currentSsns.count, id:\.self) { index in
                let var_item = var_currentSsns[index]
                let var_selected = var_item.var_id == var_selEp.var_id
                HStack(spacing: 0){
                  if var_item.var_dub == "1" {
                    Text("DUB")
                      .ht_commonTextStyle(color: Color(hex: ("ffffff")), fontSize: 8, weight: .bold)
                      .frame(width: 21, height: 16)
                      .background(Color(hex: var_purpleColor))
                      .cornerRadius(2)
                      .padding(.trailing, 5)
                  }
                  Text(var_item.var_title ?? "")
                    .ht_commonTextStyle(color: Color(hex: var_selected ? var_orangeColor : var_darkColor), fontSize: var_h3, weight: .none)
                    .lineLimit(1)
                  Spacer()
                }
                .frame(alignment: .leading)
                .padding(.leading, var_marginLeft)
                .padding(.trailing, var_marginLeft)
                .padding(.vertical, 15)
                .onTapGesture {
                  if !var_selected {
                    var_onSelEp!(var_item)
                  }
                }
                .id(var_item.var_id)
                .onAppear{
                  var_scroll.scrollTo(var_selEp.var_id)
                }
              }
            }
          }
        }.padding(.bottom, 30)
      }
      .frame(width: UIDevice.ht_screenWidth(), height: UIDevice.ht_screenHeight() - var_videoHeight - UIDevice.ht_safeDistanceTop(), alignment: .top)
      .background(Color(hex: "ffffff"))
      .cornerRadius(24, corners: [.topLeft, .topRight])
      .padding(.top, var_videoHeight + UIDevice.ht_safeDistanceTop())
      .onTapGesture {}
    }
    .frame(width: UIDevice.ht_screenWidth(), height: UIDevice.ht_screenHeight())
    .background(Color(white:0, opacity: 0.5))
    .onChange(of: var_selEp_id, perform: { new_value in
      if new_value != nil {
        var_selEp = var_animeInfo.ht_curEp(ep_id: new_value ?? "")
        var_currentSsns = var_animeInfo.ht_currentSsns(ep_id: new_value ?? "")
      }
    })
    .onTapGesture {
      var_onHideDialog!()
    }
  }
}
